<div class="">
    <div class="white-bg padding-left padding-right padding-top border-radius-top">
        <div class="flex justify-between">
            <div class="text-title">
                分销员详情
            </div>
            <div>

            </div>
        </div>
        <!-- 业主信息 -->
        <div class="margin-top">
            <div class="row">
                <div class="col-sm-3">
                    <div class="form-group">
                        <label class="col-form-label">分销员ID：</label>
                        <label class="">{{affiliateUserInfo.auId}}</label>
                    </div>
                </div>
                <div class="col-sm-3">
                    <div class="form-group">
                        <label class="col-form-label">规则名称:</label>
                        <label class="">{{affiliateUserInfo.ruleName}}</label>
                    </div>
                </div>
                <div class="col-sm-3">
                    <div class="form-group">
                        <label class="col-form-label">关联用户名称:</label>
                        <label class="">{{affiliateUserInfo.userName}}</label>
                    </div>
                </div>
                <div class="col-sm-3">
                    <div class="form-group">
                        <label class="col-form-label">分销等级:</label>
                        <label class="">{{_level(affiliateUserInfo.level)}}</label>
                    </div>
                </div>

                <div class="col-sm-3">
                    <div class="form-group">
                        <label class="col-form-label">累计佣金:</label>
                        <label class="">{{affiliateUserInfo.totalCommission}}</label>
                    </div>
                </div>
                <div class="col-sm-3">
                    <div class="form-group">
                        <label class="col-form-label">可提现佣金:</label>
                        <label class="">{{affiliateUserInfo.availableCommission}}</label>
                    </div>
                </div>
                <div class="col-sm-3">
                    <div class="form-group">
                        <label class="col-form-label">已提现佣金:</label>
                        <label class="">{{affiliateUserInfo.withdrawnCommission}}</label>
                    </div>
                </div>
                <div class="col-sm-3">
                    <div class="form-group">
                        <label class="col-form-label">团队人数:</label>
                        <label class="">{{affiliateUserInfo.teamCount}}</label>
                    </div>
                </div>
            </div>

        </div>
        <div class="vc-line-primary margin-top"></div>
        <div class="margin-top-sm">
            <ul class="nav nav-tabs">
                <li class="nav-item">
                    <a v-if="affiliateUserInfo.level === '1'" class="nav-link" v-bind:class="{active:affiliateUserInfo._currentTab == 'detailAffiliateUser'}"
                       v-on:click="changeTab('detailAffiliateUser')">
                        <vc:i18n name="二级分销员" namespace="detailAffiliater"></vc:i18n>
                    </a>
                </li>

                <li class="nav-item">
                    <a class="nav-link" v-bind:class="{active:affiliateUserInfo._currentTab == 'detailAffiliateRelation'}"
                       v-on:click="changeTab('detailAffiliateRelation')">
                        <vc:i18n name="绑定用户" namespace="detailAffiliater"></vc:i18n>
                    </a>
                </li>

                <li class="nav-item">
                    <a class="nav-link" v-bind:class="{active:affiliateUserInfo._currentTab == 'detailAffiliateCommission'}"
                       v-on:click="changeTab('detailAffiliateCommission')">
                        <vc:i18n name="分销订单" namespace="detailAffiliater"></vc:i18n>
                    </a>
                </li>

                <li class="nav-item">
                    <a class="nav-link" v-bind:class="{active:affiliateUserInfo._currentTab == 'detailAffiliateWithdrawal'}"
                       v-on:click="changeTab('detailAffiliateWithdrawal')">
                        <vc:i18n name="提现记录" namespace="detailAffiliater"></vc:i18n>
                    </a>
                </li>

            </ul>
        </div>
    </div>

    <div class="white-bg padding-left padding-right padding-top border-radius-bottom">
        <div v-if="affiliateUserInfo._currentTab == 'detailAffiliateUser'">
            <vc:create path="affiliate/detailAffiliateUser"></vc:create>
        </div>

        <div v-if="affiliateUserInfo._currentTab == 'detailAffiliateRelation'">
            <vc:create path="affiliate/detailAffiliateRelation"></vc:create>
        </div>

        <div v-if="affiliateUserInfo._currentTab == 'detailAffiliateCommission'">
            <vc:create path="affiliate/detailAffiliateCommission"></vc:create>
        </div>


        <div v-if="affiliateUserInfo._currentTab == 'detailAffiliateWithdrawal'">
            <vc:create path="affiliate/detailAffiliateWithdrawal"></vc:create>
        </div>



    </div>

</div>
